<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>活动打卡</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="${staticpath}/front/dist/css/sm.css">
    <style>
        html,body,.main-box{height: 100%;width: 100%;}
        .main-box{background: url("/resource/images/signBg.jpg") no-repeat;background-size: 100%;position: relative;}
        .back-to-home{display: inline-block;margin: 20px 0 0 20px;width: 25px;height: 25px;}
        .back-to-home img{width: 100%;}
        .sign-btn{  display: block;position: absolute;font-size: 18px;padding: 10px 0;left: 50%;margin-left: -34%; bottom: 40px;width: 68%;background: #f5484c;border-radius: 4px;border-bottom: 4px solid #92070a;color: #fff;text-align: center;}
        .sign-btn:active{border-bottom: 0;}
        .activity-info{color: #767676;font-family: '宋体';position: absolute;left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);top: 60%;text-align: center;font-weight: bold;}
        .activity-info p{margin: 0;}
        .activity-info p:last-child{font-size: 14px;}
        .activity-name{color: #ff0000;}
    </style>
</head>
<body>
    <div class="main-box">
        <a class="back-to-home" href="${basepath}/toHome">
            <img src="/resource/images/sign-back.png" alt=""/>
        </a>
        <div class="activity-info">
            <p>欢迎参加</p>
            <p class="activity-name"></p>
            <p>公益活动</p>
        </div>

        <#--打卡按钮-->
        <a href="javascript:;" class="sign-btn" data-url="${basepath}/toHome">打卡</a>
    </div>



<script type='text/javascript' src='${staticpath}/front/dist/js/lib/zepto.js' charset='utf-8'></script>
<script type='text/javascript' src='${staticpath}/front/dist/js/lib/sm.js' charset='utf-8'></script>
<script>
    function getQueryString(name) {
        var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
        var r = window.location.search.substr(1).match(reg);
        if (r != null) {
            return unescape(r[2]);
        }
        return null;
    }
    var offlineId = getQueryString("offlineId");

    $.ajax({
        type: "GET",
        url: "/front/offline/selectDetail",
        data: {
            id: offlineId
        },
        dataType: "json",
        success:function(res){
            if(res.success){
                $('.activity-name').text('\"'+res.data.name+'\"')
            }
        }
    })
     $('.sign-btn').click(function(){
         $.ajax({
             type:'POST',
             dataType:'json',
             url:'/front/offlineAccount/signAccount',
             data:{
                 offlineID:offlineId
             },
             success:function(res){
                 if(res.success){
                     $.toast(res.message);
                     setTimeout(function(){
                         var url=$('.sign-btn').attr('data-url');
                         window.location.href=url;
                     },2000)
                 }else{
                     $.toast(res.message);
                 }
             }
         })
     })
</script>

</body>
</html>